<template>
  <div style="min-height: 300px;">
    <a-tree
      :selectedKeys.sync="selected"
      :replace-fields="replaceFields"
      :tree-data="treeData"
      @select="onSelect"
    >
    </a-tree>
  </div>
</template>

<script>
import { getCustOrgTree } from '@/api/subassembly/TreeSelectOrganization' // api
export default {
  components: {},
  props: {
    // 树列表参数配置
    replaceFields: {
      type: Object,
      default() {
        return { children: 'children', title: 'label', key: 'id' }
      }
    },
    selectedKeys: {
      type: Array,
      default: () => []
    }
  },
  computed: {},
  data() {
    return {
      treeData: [],
      selected: [],
      selectOptions: {}
    }
  },
  created() {
    this.getList()
  },
  methods: {
    getList() {
      getCustOrgTree({ containTags:['CO','BC'],
      baseOrgType:0, 
      systemOrgType: 1, 
      containVirtual: 1, }).then((res) => {
        const list = []
        this.tranformTree(list, res.data)
        this.selected = list.length ? [list[0].id] : []
        this.treeData = list
        this.$emit('update:selectedKeys', this.selected)
        this.$emit('loader')
      })
    },
    tranformTree(list, data) {
      for (let i = 0; i < data.length; i++) {
        const obj = data[i]
        if (!obj.pid) obj.label = '直属机关'
        list.push(obj)
        if (obj.children) {
          const child = obj.children
          this.tranformTree(list, child)
          delete obj.children
        }
      }
    },
    // 渲染列表
    onSelect(e) {
      this.$emit('update:selectedKeys', e)
      this.$emit('onOrgSelect', e)
      this.$emit('loader')
    }
  },
  watch: {
    selected(e) {
      this.$emit('update:selectedKeys', this.selected)
    },
    selectOptions(e) {
      this.$emit('update:selectOptions', e)
    }
  }
}
</script>
